/*
 * @Description: 层级列表
 * @Author: Rfan
 * @Date: 2022-01-25 18:02:15
 * @LastEditTime: 2022-02-23 14:31:39
 */

import { useState } from 'react';
import classNames from 'classnames/bind';

import styles from '../styles/fileLevelTable.module.scss';
import RecordTable from './tableComp/RecordTable';
import FileTable from './tableComp/FileTable';
import ERecordTable from './tableComp/ERecordTable';

const cx = classNames.bind(styles);
const FileLevelTable = ({ data }: any) => {
  console.log('table wrap', data);

  const [recordQuery, setRecordQuery] = useState<number[]>([]);
  const [eRecordQuery, setERecordQuery] = useState<number[]>([]);

  /**
   * @description: FileTable 案卷表格变动触发方法
   * @param {*}
   */
  const fileSelectChange = (info: number[]) => {
    setRecordQuery(info);
  };

  /**
   * @description: RecordTable 文件表格变动触发方法
   * @param {*}
   */
  const recordSelectChange = (info: number[]) => {
    setERecordQuery(info);
  };

  /**
   * @description: eFileTable 文件表格变动触发方法
   * @param {*}
   */
  const eFileSelectChange = () => {
    console.log('recordSelectChange');
  };

  return (
    <div className={cx('file-pane')}>
      <FileTable base={data} selectChange={fileSelectChange} />
      <div className={cx('record-wrap')}>
        <RecordTable base={data} query={recordQuery} selectChange={recordSelectChange} />
        <ERecordTable base={data} query={eRecordQuery} selectChange={eFileSelectChange} />
      </div>
    </div>
  );
};

export default FileLevelTable;
